#backcont{ /*根据ID进行组件渲染*/
    background-image: url(../../../public/IMG/background.jpg);  /*关联背景图*/
    background-attachment: fixed; /*自适应布局*/
    background-repeat: no-repeat;
    background-size: cover; /*大小全覆盖*/
    -webkit-background-size:100% 100%;
    -moz-background-size:100% 100%;
    min-height: 100vh;
}

.content{ /*根据class进行渲染*/
    position: absolute; /*固定位置模式*/
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%); /*加上上面2个属性是居中的意思*/
}

.login-cont{
    width: 500px;
    height: 300px;
    background-color: blueviolet;
    opacity: 0.95;        /*半透明*/
    border-radius:20px;  /*圆角*/
}

.title{
    text-align: center; /*居中显示*/
    color: #fff; /*字体颜色*/
    font-size: 30px; /*字体大小*/
    padding-top: 30px; /*顶部边距*/
    font-family: Arial, Helvetica, sans-serif; /*字体样式*/
}

.login-input{
    display:flex ;   
    margin: 0 auto;
    padding-top: 30px;
    width:400px;
    height: 40px;
    align-items: center;
}
.login-input p{ /* login-input 类下的 p标签*/
    width:50px;
    color: #fff; /*字体颜色*/
    font-size: 20px; /*字体大小*/
}
.inptflex{
    flex:1;
}
.isLogin{
    width:400px;
    display: flex;
    justify-content: flex-end; /*右对齐*/
    margin: 0 auto;
    padding-top: 10px;
}

.isLogin p{
    cursor: pointer ; /**鼠标进入时变成小手*/
}

.login-btn{
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px auto 0 auto ;
    font-size: 16px;
}







